import './style.css'
import * as THREE from 'three';
import WebGL from 'three/addons/capabilities/WebGL.js';
// 导入轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls"
//导入 gltf 加载器
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js"
import { RoomEnvironment } from 'three/examples/jsm/environments/RoomEnvironment';
/* 导入GUI */
import { GUI } from 'three/addons/libs/lil-gui.module.min.js';


let camera, scene, renderer, controls;

init();
animate();

function init() {

 // 透视相机
  camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 10);
  camera.position.set(- 0.75, 0.7, 1.25);

  // 场景
  scene = new THREE.Scene();

  new GLTFLoader().load('./assets/SheenChair.glb', function (gltf) {
    scene.add(gltf.scene);
  });

  //渲染器
  renderer = new THREE.WebGLRenderer({ antialias: true });
  renderer.setPixelRatio(window.devicePixelRatio);
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);

  const environment = new RoomEnvironment(renderer);
  const pmremGenerator = new THREE.PMREMGenerator(renderer);

  scene.background = new THREE.Color(0x000000);
  scene.environment = pmremGenerator.fromScene(environment).texture;

  // 控制器
  controls = new OrbitControls(camera, renderer.domElement);
  controls.enableDamping = true;
  controls.minDistance = 1;
  controls.maxDistance = 10;
  controls.target.set(0, 0.35, 0);
  controls.update();

  window.addEventListener('resize', onWindowResize);

}

function onWindowResize() {

  camera.aspect = window.innerWidth / window.innerHeight;
  camera.updateProjectionMatrix();

  renderer.setSize(window.innerWidth, window.innerHeight);

}



function animate() {

  requestAnimationFrame(animate);
  controls.update();
  renderer.render(scene, camera);

}

